<template>
  <a-spin :spinning="loading">
    <a-card style="margin-top: 12px" :bordered="true" title="科研">
      <div slot="extra">
        总分: <i style='font-style: normal;color: rgba(0, 0, 0, 0.85);font-weight: 500;font-size: 16px;'>{{ score.score }}</i>
        <a-button style="margin-left: 20px" :icon="this.getIconShow" @click="showButtomShow"> {{ this.getButtomShow }}</a-button>
      </div>
      <div v-show="isShow">
<!--        <research-kygl-items :teacher-info="{workNo:this.userName,date:this.date}" :disabled="true"></research-kygl-items>-->
        <a-list size="small">
          <a-list-item v-for="(item,index) in items" :key="index" :border="true">
            <a-list-item-meta>
              <a slot="title" style="color: rgba(0, 0, 0, .85)">{{ item.projectName }}</a>
            </a-list-item-meta>
<!--            <div slot="actions">-->
<!--              <a @click="handleDetail()">详情</a>-->
<!--            </div>-->
            <div class="list-content">
              <div class="list-content-item">
                <a-tag >{{item.roleK}}</a-tag>
              </div>
              <div class="list-content-item" >
                <span >积分</span>
                <p>{{ item.score }}</p>
              </div>
            </div>
          </a-list-item>
        </a-list>
      </div>
      <template slot="actions"  v-if="teacherType=='1-1'">
        <teacher-result-ranking :schoolRanking="schoolRanking" :schoolTotal="teacherCount.schoolTeacherCount" :depRanking="depRanking" :depTotal="teacherCount.orgTeacherCount"></teacher-result-ranking>
      </template>
    </a-card>
  </a-spin>

</template>

<script>

import { getAction } from '@api/manage'
import ResearchKyglItems from '@views/gfxy/research/modules/ResearchKyglItems'
import teacherResultRanking from '@views/gfxy/result/modules/teacherResultRanking'

export default {
  name: 'teacherResultResearchGL',
  components: {
    ResearchKyglItems,teacherResultRanking
  },
  props: {
    userName: {
      type: String,
      required: true
    },
    date:{
      type:String,
      required: true
    },
    teacherCount:{
      type: Object,
      required: true
    },
    score:{
      type: Object,
      required: true
    },
    teacherType:{
      type:String,
      required: true
    }
  },

  data(){
    return {
      totalScore:0.0,
      isShow:false,
      loading: false,
      items: [],
      url: {
        list: "/research/researchKygl/list"
      }
    }
  },
  computed:{
    getButtomShow(){
      if(this.isShow){
        return "隐藏详情"
      } else {
        return "显示详情"
      }
    },
    getIconShow(){
      if(this.isShow){
        return "up-circle"
      } else {
        return "down-circle"
      }
    },
    schoolRanking(){
      if(this.score.score == 0){
        return this.teacherCount.schoolTeacherCount
      } else {
        return this.score.shcoolRanked
      }
    },
    depRanking(){
      if(this.score.score == 0){
        return this.teacherCount.orgTeacherCount
      } else {
        return this.score.orgRanked
      }
    }
  },
  methods: {
    showButtomShow(){
      this.isShow = !this.isShow
    },
    load(){
      if(!this.url.list){
        this.$message.error("请设置url.list属性!")
        return
      }

      let params = { workNo:this.userName,date:this.date };//查询条件
      console.log(params);
      console.log(this.userName)
      this.loading = true;

      getAction(this.url.list, params).then((res) => {
        console.log("123123123123")
        console.log(res);
        if (res.success) {
          this.items = res.result.records||res.result;
          console.log(this.items)
        }
        if(res.code===510){
          this.$message.warning(res.message)
        }
        this.loading = false;
      }).finally(()=>{
          this.loading = false;
        }
      )
    }
  },
  mounted() {
    this.load();
  }
}
</script>

<style lang="less" scoped>
.list-content-item {
  color: rgba(0, 0, 0, .45);
  display: inline-block;
  vertical-align: middle;
  font-size: 14px;
  margin-left: 40px;
  span {
    line-height: 20px;
  }
  p {
    margin-top: 4px;
    margin-bottom: 0;
    line-height: 22px;
    color: rgba(0, 0, 0, .85);
  }
}
</style>